{% extends "base_generic.html" %}
{% load i18n %}
{% block content %}
<h1>{% trans "Borrow Ranking" %}</h1>
<div class="row row-cols-1 row-cols-md-2 row-cols-lg-3 g-4">
  {% for book in books %}
    <div class="col">
      <div class="card h-100">
        {% if book.image %}
          <img src="{{ book.image.url }}" class="card-img-top" alt="{{ book.title }} cover" style="height: 200px; object-fit: cover;">
        {% endif %}
        <div class="card-body">
          <h5 class="card-title"><a href="{% url 'book-detail' book.pk %}">{{ book.title }}</a></h5>
          <p class="card-text">{% trans "Author" %}: {{ book.author }}</p>
          <p class="card-text">{% trans "Borrowed count" %}: {{ book.borrowed_count }}</p>
          <p class="card-text">{% trans "Average rating" %}: {{ book.avg_rating|default:_('No rating yet') }}</p>
        </div>
      </div>
    </div>
  {% endfor %}
</div>
{% endblock %} 